import React, { useState } from 'react';
import Icon from '../icon';
import s from './style.module.css';
import PropTypes from 'prop-types';
import Dialog from '@knownsec/react-component/dist/Dialog';
import Table from '@knownsec/react-component/dist/Table';
import { columns, scoreText } from './scoreText';
export default function Left({ info }) {
	const [visible, setVisible] = useState(false);
	const support = e => {
		if ('is_support_ipv6' in info) {
			if (info.is_support_ipv6) {
				return (
					<div className={s.tBox}>
						<div className={s.t1Bpx}>
							<Icon active={1} />
							<div className={s.t1}>
								<p>支持&nbsp;&nbsp;IPv6</p>
								<p className={s.score}>{info.score}分</p>
							</div>
						</div>
						<div className={s.t2}>
							根据国家IPv6发展监测平台检测标准，您的资产支持IPv6服务
						</div>
					</div>
				);
			} else {
				return (
					<div className={s.tBox}>
						<div className={s.t1Bpx}>
							<Icon active={2} />
							<div className={s.t1}>
								<p>不支持&nbsp;&nbsp;IPv6</p>
								<p className={s.score}>{info.score}分</p>
							</div>
						</div>
						<div className={s.t2}>
							根据国家IPv6发展监测平台检测标准，您的资产暂不支持IPv6服务
						</div>
					</div>
				);
			}
		} else {
			return (
				<div className={s.tBox}>
					<div className={s.t1Bpx}>
						<Icon active={3} />
						<div className={s.t1}>
							<p>未知</p>
							<p className={s.score}>- -</p>
						</div>
					</div>

					<div className={s.t2}>正在检测中...</div>
				</div>
			);
		}
	};
	return (
		<div className={s.leftBox}>
			<div className={s.title}>
				<span className={s.title_1}>结果评估</span>
				<span
					className={s.title_2}
					onClick={() => {
						setVisible(true);
					}}
				>
					评估说明
				</span>
			</div>
			{support(1)}
			<Dialog
				className={s.w800}
				title={'评估说明'}
				visible={visible}
				onhide={() => setVisible(false)}
				cancelText={''}
			>
				<div className={s.diaBox}>
					<p>
						1、ScanV
						IPv6合规检测项严格按照国家IPv6发展监测平台要求及中华人民共和国通信行业标准
						YD/T3118-2016《网站 IPv6 支持度评测指标与测试方法》进行检测评估。
					</p>
					<p>
						2、网站需同时支持AAAA记录、IPv6授权体系及首页IPv6可达，才满足政策合规要求，被评估支持IPv6；存在单项不符合，则该网站被评估为不支持IPv6服务。
					</p>
					<p>3、评分细则</p>
					<Table
						columns={columns}
						data={scoreText}
						pro
						style={{ marginBottom: '0.75rem' }}
					/>
					<span>
						<p>注：</p>
						<p>
							1.评分标准来源：国家IPv6发展监测平台（网址：https://finance.china-ipv6.cn/#/point-description）
						</p>
						<p>
							2.每个指标满分为100分，每个网站的得分为指标得分乘以权重后的求和
						</p>
					</span>
				</div>
			</Dialog>
		</div>
	);
}
Left.propTypes = {
	info: PropTypes.any,
};
